<#noparse><#import "/spring.ftl" as spring />
<#import "/tpl/layouts/xyLayout.ftl" as layout>
<@layout.title>登录</@layout.title>
<@layout.css></@layout.css><@layout.content>
<el-row id="mainBox">
    <div style="width:333px;height:auto; padding-bottom:20px; position:absolute;left:51%;top:190px; border-radius:10px; background-color:#f0f0f0;">
        <el-col :span="22">
            <el-form ref="loginForm" :model="loginForm" :rules="loginFormRules" label-width="10%" style="margin-top:100px;">
                <el-form-item prop="username">
                    <el-input v-model="loginForm.username" placeholder="请输入 用户名"/>
                </el-form-item>
                <el-form-item prop="password">
                    <el-input type="password" v-model="loginForm.password" placeholder="请输入 密码"/>
                </el-form-item>
                <el-form-item>
                    <el-button type="primary" v-on:click="login">登录</el-button>
                </el-form-item>
            </el-form>
        </el-col>
    </div>
</el-row>
</@layout.content>
<@layout.script>
<script>
(function(){
    if (top != window) {
        top.location.href=window.location.href;
        return;
    }
    var vue = new Vue({
        el: '#mainBox',
        data: {
            loginForm:{
                username:'',
                password:''
            },
            loginFormRules:{
                username:[{required:true, message:'请输入 用户名', trigger:'blur'}],
                password:[{required:true, message:'请输入密码', trigger:'blur'}]
            }
        },
        methods:{
            login:function(){
                this.$refs['loginForm'].validate((valid) => {
                    this.$http.post('login.action?_='+Math.random(), {'username':this.loginForm.username, 'password':this.loginForm.password}).then(function(response){
                        if(response.body==1){
                            document.location.href='/main/index.action';
                        }else{
                            this.$alert('login fail','警告');
                        }
                    }, function(response){
                        this.$alert('登录失败:'+response.body,'警告');
                    });
                });
            }
        }
    });
})();
</script> </@layout.script></#noparse>